<html>
<head>
    <title>Swimlanes</title>

    <!-- Sets the basepath for the library if not in same directory -->
    <script type="text/javascript">
        mxBasePath = '/static';
    </script>

    <!-- Loads and initializes the library -->
    <script type="text/javascript" src="/static/js/mxClient.js"></script>
    <script type="text/javascript" src="/static/jquery/jquery-1.7.1.min.js"></script>

    <!-- Example code -->
    <script type="text/javascript">
        function draw(graphContainer) {
            var stageData;
            var departmentData;
            var documentData;
            var document_status = [];
            document_status["00"] = "已创建";
            document_status["01"] = "待审核";
            document_status["02"] = "已审核";
                        document_status["70"] = "待变更";
                        document_status["80"] = "待修改";
                        document_status["90"] = "待创建";

            function get_jsondata() {
                //Stage信息
                var type = '01';
                data_url = "/json/type=" + type;
                $$.ajax({
                    async: false,
                    type: "get",
                    url: data_url,
                    dataType: "json",
                    success: function (data) {
                        stageData = data.iStageBaseInfo;
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        alert(errorThrown);
                    }
                });

                //部门信息
                var type = '02';
                data_url = "/json/type=" + type;
                $$.ajax({
                    async: false,
                    type: "get",
                    url: data_url,
                    dataType: "json",
                    success: function (data) {
                        departmentData = data.iDepartmentInfo;
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        alert(errorThrown);
                    }
                });

                //Stage信息
                var type = '03';
                data_url = "/json/type=" + type;
                $$.ajax({
                    async: false,
                    type: "get",
                    url: data_url,
                    dataType: "json",
                    success: function (data) {
                        documentData = data.iDocumentBaseInfo;
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        alert(errorThrown);
                    }
                });
            }

            function text_wrap(text) {
                var newtext = "";
                var wrap_length = 6;
                for(var x = 0; x < text.length / 6; x++) {
                    var temp = text.substring(x*6,x*6+6);
                    if(newtext == "")
                    {
                        newtext = newtext + temp;
                    }
                    else
                    {
                        newtext = newtext + '\n'+ temp;
                    }
                }
                return newtext
            }

            // Defines an icon for creating new connections in the connection handler.
            // This will automatically disable the highlighting of the source vertex.
            mxConnectionHandler.prototype.connectImage = new mxImage('/static/images/connector.gif', 16, 16);

            //开始获取数据
            get_jsondata();
            //get_json_data();
            // This function is invoked from the onLoad event handler of the document (see below).
            var container = document.getElementById(graphContainer);
            main(container);

            function main(container) {
                // Checks if browser is supported
                if (!mxClient.isBrowserSupported()) {
                    // Displays an error message if the browser is
                    // not supported.
                    mxUtils.error('Browser is not supported!', 200, false);
                }
                else {
                    // Creates a wrapper editor around a new graph inside
                    // the given container using an XML config for the
                    // keyboard bindings
                    var config = mxUtils.load(
                            '/static/editors/config/keyhandler-commons.xml').getDocumentElement();
                    var editor = new mxEditor(config);
                    editor.setGraphContainer(container);
                    var graph = editor.graph;
                    var model = graph.getModel();

                    // Auto-resizes the container
                    graph.border = 80;
                    graph.getView().translate = new mxPoint(graph.border / 2, graph.border / 2);
                    graph.setResizeContainer(true);
                    graph.graphHandler.setRemoveCellsFromParent(false);

                    // Changes the default vertex style in-place
                    var style = graph.getStylesheet().getDefaultVertexStyle();
                    style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_SWIMLANE;
                    style[mxConstants.STYLE_VERTICAL_ALIGN] = 'middle';
                    style[mxConstants.STYLE_LABEL_BACKGROUNDCOLOR] = 'white';
                    style[mxConstants.STYLE_FONTSIZE] = 11;
                    style[mxConstants.STYLE_STARTSIZE] = 22;
                    style[mxConstants.STYLE_HORIZONTAL] = false;
                    style[mxConstants.STYLE_FONTCOLOR] = 'black';
                    style[mxConstants.STYLE_STROKECOLOR] = 'black';
                    delete style[mxConstants.STYLE_FILLCOLOR];

                    style = mxUtils.clone(style);
                    style[mxConstants.STYLE_FONTSIZE] = 12;
                    style[mxConstants.STYLE_HORIZONTAL] = true;
                    style[mxConstants.STYLE_VERTICAL_ALIGN] = 'middle';
//                    style[mxConstants.STYLE_ALIGN] = 'left';
                    style[mxConstants.STYLE_LABEL_BACKGROUNDCOLOR] = 'none';
                    graph.getStylesheet().putCellStyle('horizon_labels', style);

                    style = mxUtils.clone(style);
                    style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_RECTANGLE;
                    graph.getStylesheet().putCellStyle('process_hidden', style);

                    style = mxUtils.clone(style);
                    style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_RECTANGLE;
                    style[mxConstants.STYLE_FONTSIZE] = 10;
                    //style[mxConstants.STYLE_ROUNDED] = true;
                    style[mxConstants.STYLE_HORIZONTAL] = true;
                    style[mxConstants.STYLE_VERTICAL_ALIGN] = 'middle';
                    delete style[mxConstants.STYLE_STARTSIZE];
                    style[mxConstants.STYLE_WHITE_SPACE] = 'wrap';
                    style[mxConstants.STYLE_LABEL_BACKGROUNDCOLOR] = 'none';
                    graph.getStylesheet().putCellStyle('process', style);

                    style = mxUtils.clone(style);
                    style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_RECTANGLE;
                    style[mxConstants.STYLE_FONTSIZE] = 10;
                    //style[mxConstants.STYLE_ROUNDED] = true;
                    style[mxConstants.STYLE_HORIZONTAL] = true;
                    style[mxConstants.STYLE_VERTICAL_ALIGN] = 'middle';
                    delete style[mxConstants.STYLE_STARTSIZE];
                    style[mxConstants.STYLE_FILLCOLOR] = '#D3D3D3';
                    style[mxConstants.STYLE_WHITE_SPACE]='wrap';
                    //边框颜色
                    style[mxConstants.STYLE_STROKECOLOR]='#D3D3D3';
                    //加阴影的样例
                    //style[mxConstants.STYLE_SHADOW] = true;
                    //style[mxConstants.STYLE_STROKECOLOR] = '#7a7a7a';
                    graph.getStylesheet().putCellStyle('process_grey', style);


                    style = mxUtils.clone(style);
                    style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_RECTANGLE;
                    style[mxConstants.STYLE_FONTSIZE] = 10;
                    //style[mxConstants.STYLE_ROUNDED] = true;
                    style[mxConstants.STYLE_HORIZONTAL] = true;
                    style[mxConstants.STYLE_VERTICAL_ALIGN] = 'middle';
                    delete style[mxConstants.STYLE_STARTSIZE];
                    style[mxConstants.STYLE_FILLCOLOR] = '#99FF33';
                    style[mxConstants.STYLE_WHITE_SPACE]='wrap';
                    graph.getStylesheet().putCellStyle('process_green', style);

                    style = mxUtils.clone(style);
                    style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_RECTANGLE;
                    style[mxConstants.STYLE_FONTSIZE] = 10;
                    //style[mxConstants.STYLE_ROUNDED] = true;
                    style[mxConstants.STYLE_HORIZONTAL] = true;
                    style[mxConstants.STYLE_VERTICAL_ALIGN] = 'middle';
                    delete style[mxConstants.STYLE_STARTSIZE];
                    style[mxConstants.STYLE_FILLCOLOR] = '#33CCFF';
                    style[mxConstants.STYLE_WHITE_SPACE] = 'wrap';
                    graph.getStylesheet().putCellStyle('process_blue', style);

                    style = mxUtils.clone(style);
                    style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_RECTANGLE;
                    style[mxConstants.STYLE_FONTSIZE] = 10;
                    //style[mxConstants.STYLE_ROUNDED] = true;
                    style[mxConstants.STYLE_HORIZONTAL] = true;
                    style[mxConstants.STYLE_VERTICAL_ALIGN] = 'middle';
                    delete style[mxConstants.STYLE_STARTSIZE];
                    style[mxConstants.STYLE_FILLCOLOR] = '#CC3300';
                    style[mxConstants.STYLE_WHITE_SPACE] = 'wrap';
                    graph.getStylesheet().putCellStyle('process_red', style);

                    style = mxUtils.clone(style);
                    style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_ELLIPSE;
                    style[mxConstants.STYLE_PERIMETER] = mxPerimeter.EllipsePerimeter;
                    delete style[mxConstants.STYLE_ROUNDED];
                    graph.getStylesheet().putCellStyle('state', style);

                    style = mxUtils.clone(style);
                    style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_RHOMBUS;
                    style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RhombusPerimeter;
                    style[mxConstants.STYLE_VERTICAL_ALIGN] = 'top';
                    style[mxConstants.STYLE_SPACING_TOP] = 40;
                    style[mxConstants.STYLE_SPACING_RIGHT] = 64;
                    graph.getStylesheet().putCellStyle('condition', style);

                    style = mxUtils.clone(style);
                    style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_DOUBLE_ELLIPSE;
                    style[mxConstants.STYLE_PERIMETER] = mxPerimeter.EllipsePerimeter;
                    style[mxConstants.STYLE_SPACING_TOP] = 28;
                    style[mxConstants.STYLE_FONTSIZE] = 14;
                    style[mxConstants.STYLE_FONTSTYLE] = 1;
                    delete style[mxConstants.STYLE_SPACING_RIGHT];
                    graph.getStylesheet().putCellStyle('end', style);

                    style = graph.getStylesheet().getDefaultEdgeStyle();
                    //style[mxConstants.STYLE_EDGE] = mxEdgeStyle.ElbowConnector;
                    style[mxConstants.STYLE_EDGE] = mxEdgeStyle.IsometricConnector;
                    style[mxConstants.STYLE_ENDARROW] = mxConstants.ARROW_BLOCK;
                    style[mxConstants.STYLE_ROUNDED] = true;
                    style[mxConstants.STYLE_FONTCOLOR] = 'black';
                    style[mxConstants.STYLE_STROKECOLOR] = 'black';

                    style = mxUtils.clone(style);
                    style[mxConstants.STYLE_DASHED] = true;
                    style[mxConstants.STYLE_EDGE] = mxEdgeStyle.ElbowConnector;
                    style[mxConstants.STYLE_ENDARROW] = mxConstants.ARROW_OPEN;
                    style[mxConstants.STYLE_STARTARROW] = mxConstants.ARROW_OVAL;
                    graph.getStylesheet().putCellStyle('crossover', style);

                    style = mxUtils.clone(style);
                    style[mxConstants.STYLE_DASHED] = true;
                    style[mxConstants.STYLE_EDGE] = mxEdgeStyle.ElbowConnector;
                    style[mxConstants.STYLE_ENDARROW] = mxConstants.ARROW_OVAL;
                    style[mxConstants.STYLE_STARTARROW] = mxConstants.ARROW_OVAL;
                    graph.getStylesheet().putCellStyle('vertical_dash', style);

                    // Installs double click on middle control point and
                    // changes style of edges between empty and this value
                    graph.alternateEdgeStyle = 'elbow=vertical';

                    // Adds automatic layout and various switches if the
                    // graph is enabled
                    if (graph.isEnabled()) {
                        // Allows new connections but no dangling edges
                        graph.setConnectable(true);
                        graph.setAllowDanglingEdges(false);

                        // End-states are no valid sources
                        var previousIsValidSource = graph.isValidSource;

                        graph.isValidSource = function (cell) {
                            if (previousIsValidSource.apply(this, arguments)) {
                                var style = this.getModel().getStyle(cell);

                                return style == null || !(style == 'end' || style.indexOf('end') == 0);
                            }

                            return false;
                        };

                        // Start-states are no valid targets, we do not
                        // perform a call to the superclass function because
                        // this would call isValidSource
                        // Note: All states are start states in
                        // the example below, so we use the state
                        // style below
                        graph.isValidTarget = function (cell) {
                            var style = this.getModel().getStyle(cell);

                            return !this.getModel().isEdge(cell) && !this.isSwimlane(cell) &&
                                    (style == null || !(style == 'state' || style.indexOf('state') == 0));
                        };

                        // Allows dropping cells into new lanes and
                        // lanes into new pools, but disallows dropping
                        // cells on edges to split edges
                        graph.setDropEnabled(true);
                        graph.setSplitEnabled(false);

                        // Returns true for valid drop operations
                        graph.isValidDropTarget = function (target, cells, evt) {
                            if (this.isSplitEnabled() && this.isSplitTarget(target, cells, evt)) {
                                return true;
                            }

                            var model = this.getModel();
                            var lane = false;
                            var pool = false;
                            var cell = false;

                            // Checks if any lanes or pools are selected
                            for (var i = 0; i < cells.length; i++) {
                                var tmp = model.getParent(cells[i]);
                                lane = lane || this.isPool(tmp);
                                pool = pool || this.isPool(cells[i]);

                                cell = cell || !(lane || pool);
                            }

                            return !pool && cell != lane && ((lane && this.isPool(target)) ||
                                    (cell && this.isPool(model.getParent(target))));
                        };

                        // Adds new method for identifying a pool
                        graph.isPool = function (cell) {
                            var model = this.getModel();
                            var parent = model.getParent(cell);

                            return parent != null && model.getParent(parent) == model.getRoot();
                        };

                        // Changes swimlane orientation while collapsed
                        graph.model.getStyle = function (cell) {
                            var style = mxGraphModel.prototype.getStyle.apply(this, arguments);

                            if (graph.isCellCollapsed(cell)) {
                                if (style != null) {
                                    style += ';';
                                }
                                else {
                                    style = '';
                                }

                                style += 'horizontal=1;align=left;spacingLeft=14;';
                            }

                            return style;
                        };

                        // Keeps widths on collapse/expand
                        var foldingHandler = function (sender, evt) {
                            var cells = evt.getProperty('cells');

                            for (var i = 0; i < cells.length; i++) {
                                var geo = graph.model.getGeometry(cells[i]);

                                if (geo.alternateBounds != null) {
                                    geo.width = geo.alternateBounds.width;
                                }
                            }
                        };

                        graph.addListener(mxEvent.FOLD_CELLS, foldingHandler);
                    }

                    // Applies size changes to siblings and parents
                    new mxSwimlaneManager(graph);

                    // Creates a stack depending on the orientation of the swimlane
                    var layout = new mxStackLayout(graph, false);

                    // Makes sure all children fit into the parent swimlane
                    layout.resizeParent = true;

                    // Applies the size to children if parent size changes
                    layout.fill = true;

                    // Only update the size of swimlanes
                    layout.isVertexIgnored = function (vertex) {
                        return !graph.isSwimlane(vertex);
                    }

                    // Keeps the lanes and pools stacked
                    var layoutMgr = new mxLayoutManager(graph);

                    layoutMgr.getLayout = function (cell) {
                        if (!model.isEdge(cell) && graph.getModel().getChildCount(cell) > 0 &&
                                (model.getParent(cell) == model.getRoot() || graph.isPool(cell))) {
                            layout.fill = graph.isPool(cell);

                            return layout;
                        }

                        return null;
                    };

                    // Gets the default parent for inserting new cells. This
                    // is normally the first child of the root (ie. layer 0).
                    var parent = graph.getDefaultParent();

                    // Adds cells to the model in a single step
                    model.beginUpdate();
                    try {
                        var swimlane_length = 640;
                        var stagebases = [];
                        var departments = [];
                        var documents = [];
                        var documents_relation = [];
                        var documents_index = [];
                        var position_table = [];
                        var department_height = [];
                        var max_position_x = 0;

                        var stage_width = 160;
                        var process_width = 80;
                        var process_height = 50;
                        var process_padding_top = 20;
                        swimlane_length = stageData.length * stage_width;

                        var title1 = graph.insertVertex(parent, null, '', 20, 20, swimlane_length, 30);
                        for (var x = 0; x < stageData.length; x++) {
                            var stageID = stageData[x].stageID;
                            var stageName = stageData[x].stageName;
                            var title_position_x = (2* x + 1)/(2 * stageData.length )  - 0.5;
                            var vline_start_position_x = (x + 1) / (stageData.length )  - 0.5;
                            stagebases[stageID] = [];
                            stagebases[stageID]["seq"] = x;
                            stagebases[stageID]["draw"] = graph.insertVertex(title1, null, stageName,title_position_x , 0.5, 0, 0, "horizon_labels", true);
                            stagebases[stageID]["draw"].setConnectable(false);
                            if(x < stageData.length - 1) {
                                stagebases[stageID]["vline_start"] = graph.insertVertex(title1, null, "", vline_start_position_x, 0, 0, 0, "horizon_labels", true);
                                stagebases[stageID]["vline_start"].setConnectable(true);
                            }
                        }

                        for (var x = 0; x < departmentData.length; x++) {
                            var departmentID = departmentData[x].departmentID;
                            var departmentName = departmentData[x].departmentName;
                            if (departmentID != "Root") {
                                //跳过Root
                                departments[departmentID] = graph.insertVertex(parent, null, departmentName, 0, 0, swimlane_length, 30);
                                departments[departmentID].setConnectable(false);
                            }
                            else {
                                //var pool1 = graph.insertVertex(parent, null, departmentName, 0, 0, swimlane_length, 0);
                                //pool1.setConnectable(false);
                            }
                        }

                        for (var x = 0; x < documentData.length; x++) {
                            var documentDepartmentID = documentData[x].departmentID;
                            if(documentDepartmentID == "Root"){
                                continue;
                            }
                            var documentID = documentData[x].documentID;
                            var documentName = documentData[x].documentName;
                            documentName = text_wrap(documentName)
                            var documentstageID = documentData[x].stageID;
                            var documentLifeCycleStatus = documentData[x].lifeCycleStatus;

                            alert(stagebases[stageID]["draw"]);
                            var padding = stagebases[documentstageID]["seq"];
                            var position_x = swimlane_length / (stageData.length)* padding + (stage_width - process_width)/2;
                            var position_y = process_padding_top;
                            var position_x_y = documentDepartmentID + "_" + documentstageID + "_" + position_x.toString() + "_" + position_y.toString();
                            var position_checker = position_table[position_x_y];
                            while (position_checker != undefined) {
                                position_y = position_y + process_height + process_padding_top/2;
                                position_x_y = documentDepartmentID + "_" + documentstageID + "_" + position_x.toString() + "_" + position_y.toString();
                                position_checker = position_table[position_x_y];
                            }
                            position_table[position_x_y] = (position_x,position_y);

                            documents[documentID] = [];
                            documents[documentID]["location"] = (position_x,position_y);
                            documents[documentID]["documentName"] = documentName;
                            documents[documentID]["departmentID"] = documentDepartmentID;
                            documents[documentID]["stageID"] = documentstageID;
                            //鼠标Hover时显示用的数据：
                            documents[documentID]["documentInChargerName"] = documentData[x].documentInChargerName;
                            documents[documentID]["startDate"] = documentData[x].startDate;
                            documents[documentID]["endDate"] = documentData[x].endDate;

                            documents[documentID]["lifeCycleStatus"] = documentLifeCycleStatus;
                            //记录部门最后的文档元素的高度
                            if (department_height[documentDepartmentID] == undefined){
                                department_height[documentDepartmentID] = position_y;
                            }
                            else{
                                if(position_y > department_height[documentDepartmentID] ){
                                    department_height[documentDepartmentID] = position_y;
                                }
                            }

                            if (position_x > max_position_x){
                                max_position_x = position_x
                            }


                            //根据documentLifeCycleStatus变更颜色
                            var current_style = "process";
                            if (documentLifeCycleStatus == "00") {
                                current_style = "process_green"
                            }
                            else if (documentLifeCycleStatus == "01") {
                                current_style = "process_blue"
                            }
                            else if (documentLifeCycleStatus == "02") {
                                current_style = "process_red"
                            }
                            else if (documentLifeCycleStatus == "03") {
                                current_style = "process_green"
                            }
                            else if (documentLifeCycleStatus == "04") {
                                current_style = "process_green"
                            }
                            else if (documentLifeCycleStatus == "06") {
                                current_style = "process_green"
                            }
                            else if (documentLifeCycleStatus == "07") {
                                current_style = "process_green"
                            }
                            else if (documentLifeCycleStatus == "90") {
                                current_style = "process_grey"
                            }
                            console.log(documentName,position_x,position_y);

                            documents[documentID]["draw"] = graph.insertVertex(departments[documentDepartmentID], null,
                                    documentName + "\n(" + document_status[documentLifeCycleStatus]+")", position_x, position_y, process_width, process_height, current_style);
                            //创建ID索引
                            documents_index[documents[documentID]["draw"].id] = documentID;


                            //写入关联关系记录，要素：1）是否同一部门（如果不是，直接复制parent） 2）前文档ID 3）后文档ID
                            var prepositionDocumentID = documentData[x].prepositionDocumentID;
                            if (prepositionDocumentID != "") {
                                documents_relation[documentID] = prepositionDocumentID;
                            }
                        }

                        //更新高度Swimlane的高度
                        var last_department = null;
                        for (var x = 0; x < departmentData.length; x++) {
                            var departmentID = departmentData[x].departmentID;
                            if (departmentID != "Root") {
                                var newHeight = department_height[departmentID] + process_height + process_padding_top;
                                graph.insertVertex(departments[departmentID], null, "", 100, newHeight, 0, 0, 'process_hidden');
                            }
                            if (x == (departmentData.length - 1)){
                                last_department = departmentData[x].departmentID;
                            }
                        }

                        //更新高度Swimlane的宽度
                        graph.insertVertex(departments[last_department], null, "", max_position_x +100 , newHeight, 0, 0, 'process_hidden');

                        for (var x = 0; x < stageData.length; x++) {
                            var stageID = stageData[x].stageID;
                            if(x < stageData.length - 1) {

                            var vline_end_position_x = (x + 1) / (stageData.length )  - 0.5;
                                stagebases[stageID]["vline_end"] = graph.insertVertex(title1, null, "", vline_end_position_x,(newHeight+5)/17, 0, 0, "horizon_labels", true);
                                stagebases[stageID]["vline_end"].setConnectable(true);
                                graph.insertEdge(parent, null, null, stagebases[stageID]["vline_start"], stagebases[stageID]["vline_end"],"vertical_dash");
                            }
                        }

                        for (keys in documents_relation) {
                            var preDocuments = documents_relation[keys].split(",");
                            var currentDepartment = documents[keys]["departmentID"];
                            for (var x = 0; x < preDocuments.length; x++) {
                                if (documents[preDocuments[x]]["departmentID"] == currentDepartment) {
                                    graph.insertEdge(departments[currentDepartment], null, null, documents[preDocuments[x]]["draw"], documents[keys]["draw"]);
                                } else {
                                    graph.insertEdge(parent, null, null, documents[preDocuments[x]]["draw"], documents[keys]["draw"]);
                                }
                            }
                        }

                    }
                    finally {
                        // Updates the display
                        model.endUpdate();
                    }

                    //悬停提示
                    graph.getTooltipForCell = function (cell) {
                        if (cell != null) {
                            var stylename = cell.style;
                            if(stylename != undefined) {
                                if (stylename.substring(0, 7) == "process") {
                                    return "责任人:" + documents[documents_index[cell.id]]["documentInChargerName"] +
                                            "\n开始时间：" + documents[documents_index[cell.id]]["startDate"] +
                                            "\n结束时间：" + documents[documents_index[cell.id]]["endDate"];
                                }
                            }
                        }

                    };

                    graph.addListener(mxEvent.CLICK, function (sender, evt) {
                        var e = evt.getProperty('event'); // mouse event
                        var cell = evt.getProperty('cell'); // cell may be null

                        if (cell != null) {
                            var stylename = cell.style;
                            if(stylename != undefined) {
                                if (stylename.substring(0, 7) == "process") {
                                    // Do something useful with cell and consume the event
                                    evt.consume();
                                    if(documents[documents_index[cell.id]]["lifeCycleStatus"]=="90"){
                                        window.open("/document/docEditForPJ.html?documentID=" + documents_index[cell.id]);
                                    }
                                    else{
                                        window.open("/document/docView.html?documentID=" + documents_index[cell.id]);
                                    }

                                }
                            }
                        }
                    });

                }
            }
        }

    </script>
</head>
<body onload="draw('graphContainer');">
<div id="graphContainer"
     style="position:absolute;overflow:hidden;top:40px;left:40px;width:600px;height:400px;border: gray dotted 1px;cursor:default;">
</div>
</body>
</html>
